import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [{
        path: '/',
        name: 'Index',
        component: () =>
            import ('../views/Index.vue'),
        redirect: '/recommend',
        children: [{
            path: "recommend",
            name: "Recommend",
            meta: {
                title: "今日歌曲推荐"
            },
            component: () =>
                import ('../views/index/Recommend.vue'),
        }, {
            path: "hot",
            name: "Hot",
            component: () =>
                import ('../views/index/Hot.vue'),
            meta: {
                title: "Hot热歌榜"
            },
        }, {
            path: "search",
            name: "Search",
            component: () =>
                import ('../views/index/Search.vue'),
            meta: {
                title: "搜你心中所属"
            },
        }]
    }, {
        path: '/details/:id',
        name: 'Details',
        component: () =>
            import ('../views/Details.vue'),
        meta: {
            title: "专辑页"
        },
    }, {
        path: '/songsheet/:id',
        name: 'Songsheet',
        component: () =>
            import ("../views/Songsheet.vue"),
        meta: {
            title: "个人歌单"
        }
    },
    {
        path: '/personalcenter/:id',
        name: 'PersonalCenter',
        component: () =>
            import ('../views/PersonalCenter.vue'),
        meta: {
            title: "个人中心页"
        },
    }, {
        path: '/play/:id',
        name: 'Play',
        component: () =>
            import ('../views/Play.vue'),
        meta: {
            title: "播放"
        },
    },

]

const router = new VueRouter({
    "linkActiveClass": "active", //更改类名
    routes
})

router.beforeEach((to, from, next) => {
    document.title = to.meta.title;
    next();
})

export default router